{% load static %}
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<link rel="stylesheet" type="text/css" href="{% static 'css/main.css'%}" />
		<title>性行为调查统计表</title>

		<script language="javascript" src="{% static 'js/province.js' %}" type="text/javascript" charset="utf-8"></script>

		<script>
			function IsPC() {
			   var userAgentInfo = navigator.userAgent;
			   var Agents = ["Android", "iPhone",
			      "SymbianOS", "Windows Phone",
			      "iPad", "iPod"];
			   var flag = true;
			   for (var v = 0; v < Agents.length; v++) {
			      if (userAgentInfo.indexOf(Agents[v]) > 0) {
			         flag = false;
			         break;
			      }
			   }
			   return flag;
			}

			var flag = IsPC(); //true为PC端，false为手机端
			if (/(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent)) { //移动端
			    alert("当前使用的是手机端，建议使用PC端打开本页面");
			}
		</script>
	</head>
	<body onload="getProvince()">

		<div id="board">
			<div id="boardtext">
				<div id="headd">

				</div>
				<h1 id="h11">性行为调查统计表</h1>
				<h3 id="h31">感谢您能抽出几分钟时间来参加本次答题，现在我们就马上开始吧！</h3>
				<hr id="hrrr">
				<form action="/submit/" method="get">
                    {% csrf_token %}
					<label for="outpatientNumber">1.门诊编号<span class="xxx">*</span></label>
					<br />
					<input type="text" name="odnumber" id="outpatientNumber" value="" class="ipt" />
					<br /><br />

					<label for="name">2.姓名<span class="xxx">*</span></label>
					<br />
					<input type="text" name="name" id="name" value="" class="ipt" />
					<br /><br />

					<label for="">3.性别<span class="xxx">*</span></label>
					<br />
					<input type="radio" name="Sex" value="男" onclick="extraQ()">&nbsp;&nbsp;男
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<input type="radio" name="Sex" value="女" onclick="extraQ()">&nbsp;&nbsp;女
					<br /><br />

					<label for="yyyy">4.出生年月<span class="xxx">*</span></label>
					<br />
					<input type="text" name="birthYear" placeholder="按格式yyyy" class="ipt" id="yyyy">
					<input type="text" name="birthMonth" placeholder="按格式mm" class="ipt" id="mm">
					<input type="text" name="birthDay" placeholder="按格式dd" class="ipt" id="dd">
					<br /><br />

					<label for="sle">5.您的最高学历（含目前在读）是？<span class="xxx">*</span></label>
					<br />
					<select id="sle" name="education">
						<option selected="" value="">请选择</option>
						<option value="小学及以下">小学及以下</option>
						<option value="初中">初中</option>
						<option value="高中">高中</option>
						<option value="大专">大专</option>
						<option value="本科">本科</option>
						<option value="硕士研究生">硕士研究生</option>
						<option value="博士研究生">博士研究生</option>
					</select>
					<br /><br />

					<label for="pN">6.手机号<span class="xxx">*</span></label>
					<br />
					<input type="text" name="phoneNumber" id="pN" value="" class="ipt" />
					<br /><br />

					<label for="wN">7.微信号<span class="xxx">*</span></label>
					<br />
					<input type="text" name="chatNumber" id="wN" value="" class="ipt" />
					<br /><br />

					<label for="province">8.现居地址<span class="xxx">*</span></label>
					<br />

					<select id="province"  name="address1" onchange="chooseProvince(this)">
						<option value="1">请选择省</option>
					</select>
					<select id="city" name="address2" onchange="chooseCity(this)">
						<option value="2">请选择市</option>
					</select>
					<select id="area" name="address3">
						<option value="3">请选择区</option>
					</select>
					<br />
					<textarea rows="" cols="" id="ta1" placeholder="请填写详细地址" name="address"></textarea>
					<br /><br />

					<label for="fSA">9.初次性行为年龄<span class="xxx">*</span></label>
					<br />
					<input type="number" name="firstSexAge" id="fSA" value="" class="ipt" />
					<br /><br />

					<label for="">10.性行为对象<span class="xxx">*</span></label>
					<br />
					<input type="radio" name="sexObject" value="同性" onclick="extraQ()">&nbsp;&nbsp;同性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<input type="radio" name="sexObject" value="异性" onclick="extraQ()">&nbsp;&nbsp;异性
					<br /><br />

					<label for="sN">11.性行为人数<span class="xxx">*</span></label>
					<br />
					<input type="number" name="sexNum" id="sN" value="" class="ipt" />
					<br /><br />

					<label for="sSN">12.近6个月性伴侣人数<span class="xxx">*</span></label>
					<br />
					<input type="number" name="sixSexNum" id="sSN" value="" class="ipt" />
					<br /><br />

					<label for="">13.是否有多人性行为<span class="xxx">*</span></label>
					<br />

					<script type="text/javascript">
						function displayNext() {
							var temp = document.getElementsByName("multiSex");
							var sp1 = document.getElementById("sp1");
							for (i = 0; i < temp.length; i++) {
								if (temp[i].checked) {
									sp1.style.display = "block";
								}
							}
						}

						function ddisplayNext() {
							var temp = document.getElementsByName("multiSex");
							var sp1 = document.getElementById("sp1");
							for (i = 0; i < temp.length; i++) {
								if (temp[i].checked) {
									sp1.style.display = "none";
								}
							}
						}
					</script>

					<input type="radio" name="multiSex" value="是"  onclick="displayNext()">&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<input type="radio" name="multiSex" value="否" onclick="ddisplayNext()">&nbsp;&nbsp;否
					<br />

					<span id="sp1" style="display: none;">
						<input type="text" name="sameTimeSex" id="hmp" value="" class="ipt" placeholder="几人同时" />
						<br />
						<input type="text" name="manwuman" id="nmmf" value="" class="ipt" placeholder="几男几女" />

					</span><br />

					<div id="fot">
						<label for="">14.平均性生活时间<span class="xxx">*</span></label>
						<br />
						<input type="radio" name="sexTime" value="不到5分钟">不到5分钟&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<input type="radio" name="sexTime" value="5~10分钟">5~10分钟
						<br />
						<input type="radio" name="sexTime" value="11~15分钟">11~15分钟 &nbsp;&nbsp;&nbsp;
						<input type="radio" name="sexTime" value="16~25分钟">16~25分钟
						<br />
						<input type="radio" name="sexTime" value="25分钟以上">25分钟以上
						<br /><br />
					</div>
					<br />
                    <button name="" id="sub" onclick="checkee()">提&nbsp;交</button>
				<!--	<input type="button" name="" id="sub" value="提&nbsp;交" onclick="checkee()" />-->
				</form>
				<div id="fooot">

				</div>
			</div>









		</div>


		<script type="text/javascript">
			var dis;

			function extraQ() {
				var sex = document.getElementsByName("Sex");
				var sexO = document.getElementsByName("sexObject");
				var x = fot.innerHTML;

				// if (dis==1) {
				// 	var ee1=document.getElementById("e1");
				// 	ee1.style.display="none";
				// } else if(dis==2) {
				// 	var ee2=document.getElementById("e2");
				// 	ee2.style.display="none";
				// } else if(dis==3) {
				// 	var ee3=document.getElementById("e3");
				// 	ee3.style.display="none";
				// } else if(dis==4) {
				// 	var ee4=document.getElementById("e4");
				// 	ee4.style.display="none";
				// }

				for (i = 0; i < sex.length; i++) {
					for (j = 0; j < sexO.length; j++) {
						if (sex[0].checked && sexO[0].checked) {
							dis = 1;
							fot.innerHTML = x +
								'<div id="e1"><span><label>男-男性方式<span class="xxx">*</span></label><br /><input type="checkbox" name="m2m" value="肛交">肛交<br /><input type="checkbox" name="m2m" value="被肛交">被肛交<br /><input type="checkbox" name="m2m" value="口交">口交<br /><input type="checkbox" name="m2m" value="被口交">被口交<br /><input type="checkbox" name="m2m" value="吻肛">吻肛<br /><input type="checkbox" name="m2m" value="被吻肛">被吻肛</span><br /></div>'
						} else if (sex[0].checked && sexO[1].checked) {
							dis = 2;
							fot.innerHTML = x +
								'<div id="e2"><span><label>男-女性方式<span class="xxx">*</span></label><br /><input type="checkbox" name="m2f" value="阴道交">阴道交<br /><input type="checkbox" name="m2f" value="口交">口交<br /><input type="checkbox" name="m2f" value="被口交">被口交<br /><input type="checkbox" name="m2f" value="肛交">肛交</span><br /></div>'
						} else if (sex[1].checked && sexO[0].checked) {
							dis = 3;
							fot.innerHTML = x +
								'<div id="e3"><span><label>女-女性方式<span class="xxx">*</span></label><br /><input type="checkbox" name="f2f" value="口交">口交<br /><input type="checkbox" name="f2f" value="被口交">被口交</span><br /></div>'
						} else if (sex[1].checked && sexO[1].checked) {
							dis = 4;
							fot.innerHTML = x +
								'<div id="e4"><span><label>女-男性方式<span class="xxx">*</span></label><br /><input type="checkbox" name="f2m" value="阴道交">阴道交<br /><input type="checkbox" name="f2m" value="被肛交">被肛交<br /><input type="checkbox" name="f2m" value="口交">口交<br /><input type="checkbox" name="f2m" value="被口交">被口交</span><br /></div>'
						}
					}
				}
			}


			function checkee() {
				var q1 = document.getElementById("outpatientNumber");
				var q2 = document.getElementById("name");
				var sex = document.getElementsByName("Sex");
				var q4_1 = document.getElementById("yyyy");
				var q4_2 = document.getElementById("mm");
				var q4_3 = document.getElementById("dd");
				var q5 = document.getElementById("sle");
				var q6 = document.getElementById("pN");
				var q7 = document.getElementById("wN");
				var q8_1 = document.getElementById("province");
				var q8_2 = document.getElementById("city");
				var q8_3 = document.getElementById("area");
				var q8_4 = document.getElementById("ta1");
				var q9 = document.getElementById("fSA");
				var sexO = document.getElementsByName("sexObject");
				var q11 = document.getElementById("sN");
				var q12 = document.getElementById("sSN");
				var mulS = document.getElementsByName("multiSex");
				var e1_1 = document.getElementById("hmp");
				var e1_2 = document.getElementById("hmmf");
				var q14 = document.getElementsByName("sexTime");

				if (q1.value != "" && q2.value != "" && q4_1.value != "" && q4_2.value != "" && q4_3.value != "" && q5.value != "" &&
					q6.value != "" && q7.value != "" && q9.value != "" && q11.value != "" && q12.value != "" && (sex[0].checked || sex[
						1].checked) && (sexO[0].checked ||
						sexO[1].checked) && (mulS[0].checked || mulS[1].checked) && (q14[0].checked || q14[1].checked || q14[2].checked ||
						q14[3].checked || q14[4].checked)) {
					if (mulS[0].checked) {
						if (e1_1.value != "" && e1_2 != "") {
							alert("已完成所有问题");
						}
					} else if (mulS[1].checked) {
						alert("已完成所有问题");
					}
					//else {
					// 	alert("所有问题都为必答题，请确认是否完成所有问题！");
					// }

				} else {
					alert("所有问题都为必答题，请确认是否完成所有问题！");
				}


			}
		</script>
	</body>
</html>
